<style>
    * {
        color: #000000;
    }

    h1, h2, h3, h4, h5, h6 {
        color: #000000;
    }

    .company-wrapper {
        max-width: 400px;
        height: 100%;
        margin: auto;
        background-color: white;
        vertical-align: middle;
        position: relative;
        padding: 10px
    }

    .image-caption {
        float: left;
        position: relative;
        width: 100%;
    }

    img.com-thumb {
        max-width: 400px;
    }

    .image-caption .caption {
        background-color: rgba(0, 0, 0, 0.7);
        bottom: 5px;
        left: 0;
        padding: 5px 0 5px 5px;;
        position: absolute;
        width: 99%;
        color: white;
    }

    .lbl-name {
        color: #307DFE;
    }

    .lbl-value {
        font-size: 14px;
    }

    .company-wrapper p {
        margin-bottom: 5px;
        border-bottom: 1px solid #d3d3d3;
        padding-bottom: 5px;
    }

</style>

<div class="company-wrapper"
     style="">
    <div class="image-caption">
        <img class="com-thumb" src="<?php echo HSUrl::home() . $model->picture ?>"
             alt="<?php echo $model->name ?>">

        <div class="caption">
            <?php echo $model->name ?>
        </div>
    </div>
    <div style="clear: both"></div>

    <?php if ($model->phone != '') {
        echo " <p>
        <label class='lbl-name'>Số điện thoại</label><br/>
        <label class='lbl-value'>$model->phone</label>
        </p>";
    }?>

    <?php if ($model->owner != '') {
        echo " <p>
        <label class='lbl-name'>Người sở hữu</label><br/>
        <label class='lbl-value'>$model->owner</label>
        </p>";
    }?>

    <?php if ($model->address != '') {
        echo " <p>
        <label class='lbl-name'>Địa chỉ</label><br/>
        <label class='lbl-value'>$model->address</label><br/>
        <label class='lbl-value'>$model->city</label><br/>
        </p>";
    }?>

    <!--    --><?php //if ($model->category != null) {
    //        echo " <p>
    //        <label class='lbl-name'>Danh mục</label><br/>
    //        <label class='lbl-value'>" . $model->category->name_vn . "</label>
    //        </p>";
    //    }
    ?>

</div>
<script type="text/javascript">
    var mobile = checkMobile();
    if (mobile.any()) {
        $(".company-wrapper").attr('style', 'max-width:90%');
        $('.com-thumb').attr('style', 'max-width:100%');
    }
</script>